<template>
  <el-dialog   :visible.sync="visible" :title="title"  width="800px"  :before-close="handleClose" :modal="false">
    <div id="printContent" style="width: 100%;">
        <table style="width: 750px;" class="tab"  run="all">
          <th colspan="4">
            <h2>保养服务工单</h2>
          </th>
          <tr>
            <td class="tdtitle">单位名称：</td>
            <td class="tdcontent">{{zyxSendorder.zyxDevice.unitname}}</td>
            <td class="tdtitle">派工单号：</td>
            <td class="tdcontent">{{zyxSendorder.orderno}}</td>
          </tr>
          <tr>

            <td class="tdtitle">设备型号：</td>
            <td class="tdcontent">{{zyxDevice.devicemodel}}</td>
            <td class="tdtitle">使用科室：</td>
            <td class="tdcontent">{{zyxSendorder.zyxDevice.useofficename}}</td>
          </tr>


          <tr>
            <td class="tdtitle">服务时间：</td>
            <td class="tdcontent">{{zyxSendorder.senddate}}</td>
            <td class="tdtitle">服务工时：</td>
            <td class="tdcontent">{{zyxSendorder.processdate}} 小时</td>
          </tr>
          <tr>
            <td class="tdtitle" style="height: 200px;">保养项目：</td>
            <td class="tdcontent" colspan="3">{{orderbill.workcontent}}</td>
          </tr>
          <tr>
            <td class="tdtitle">保养结果：</td>
            <td class="tdcontent" colspan="3">
            {{orderbill.workcontent}}<br />
              <el-row >
                <el-col v-for="(item,index) in imglist" :key="index" :span="8"><img style="height: 150px;width: 150px;" :src="imglist[index]" /></el-col>
             </el-row>

            </td>
          </tr>
          <tr>
            <td class="tdtitle">配件名称：</td>
            <td class="tdcontent">{{orderbill.partsname}}</td>
            <td class="tdtitle">配件型号：</td>
            <td class="tdcontent">{{orderbill.partsmodel}}</td>
          </tr>
          <tr>
            <td class="tdtitle">服务评价：</td>
            <td class="tdcontent" colspan="3">{{evaluatename}}</td>
          </tr>
          <tr>
            <td class="tdtitle">建议及要求：</td>
            <td class="tdcontent" colspan="3" style="height: 100px;">{{orderbill.suggest}}</td>
          </tr>
          <tr>
            <td class="tdtitle">客户签字：</td>
            <td class="tdcontent"></td>
            <td class="tdtitle">人员签字：</td>
            <td class="tdcontent"></td>
          </tr>
        </table>
     </div>
    <div slot="footer" class="dialog-footer">
     <el-button type="primary" v-print="'#printContent'">打&nbsp;&nbsp;印</el-button>
     </div>
  </el-dialog>
</template>

<script>
  import {getBillBySendOrderId,} from "@/api/zyx/bill";
  export default {
     data() {
       return {
         imglist:[],
         visible: false,
         title:'',
         zyxSendorder:{},
         zyxDevice:{},
         orderbill:{},
         // 设备类别字典字典
         devicetypeOptions: [],
         devicetypename:'',
         evaluatename:'',
         }
     },
     created() {
       // console.log('12321321-',this.zyxDevice)




     },
     methods:{
       getname(){
         this.getDicts("zyx_devicetype").then(response => {
           this.devicetypeOptions = response.data;
           // this.zyxDevice=response.data.zyxDevice

           this.devicetypename= this.selectDictLabel(this.devicetypeOptions, this.zyxDevice.devicetype);

         });
         
       },
       getbill(id){

          getBillBySendOrderId(id).then(response => {
            this.orderbill = response.data;
            this.imglist=this.orderbill.files.split(',');
            this.getDicts("zyx_evaluate").then(response => {
              this.evaluatename= this.selectDictLabel(response.data, this.orderbill.evaluate);
            });
            // console.log( this.imglist)
          });
       },
       print(){
         this.$print(this.$refs.print,{});
       },
       // /** 修改按钮操作 */
       // getinfo(row) {
       //   this.reset();
       //   const id = row.id || this.ids
       //   getMember(id).then(response => {
       //     this.form = response.data;
       //     this.open = true;


       //     this.title = "修改成员基础信";
       //   });
       // },
     }
    }
</script>

<style>
   .tab  tr td { border:1px solid #000000; }
   .tdcontent{ text-align:left;width: 220px;padding-left: 10px;}
   .tdtitle{text-align: right;width: 120px;padding-right: 10px;font-weight: bold;}
   .tab  {  min-height: 40px; line-height: 40px; text-align: center; border-collapse: collapse; }
</style>
